<!DOCTYPE html>

<head>
    <meta charset="UTF-8">
    <title>CSS 垂直按钮组</title>
    <style>
        .btn-group button {
            /* Green background */
            background-color: #4CAF50;
            /* Green border */
            border: 1px solid green;
            /* White text */
            color: white;
            /* Some padding */
            padding: 10px 24px;
            /* Pointer/hand icon */
            cursor: pointer;
            /* Set a width if needed */
            width: 50%;
            /* Make the buttons appear below each other */
            display: block;
        }

        .btn-group button:not(:last-child) {
            /* Prevent double borders */
            border-bottom: none;
        }

        /* Add a background color on hover */
        .btn-group button:hover {
            background-color: #3e8e41;
        }
    </style>
</head>

<body>
    <h1>垂直按钮组</h1>

    <div class="btn-group">
        <button>Apple</button>
        <button>Samsung</button>
        <button>Sony</button>
    </div>
</body>

</html>